<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>九九乘法表</title>
</head>
<style>
    table{
           width:600px;        /* //表格height属性可设置可不设置,建议不设置*/
           border-collapse:separate;
    }
  table td{
       border:#000000 1px solid;
      text-align: center;   /*使<td>标签中的内容居中显示，若是<th>标签，没有此行代码亦可自动居中*/
  }
</style>
<body>
    <script>
        document.write("<table>");
        for(var i=1;i<=9;i++){
            document.write("<tr>");
           for(var j=1;j<=i;j++){
               document.write("<td>"+j+"x"+i+"="+j*i+"</td>");
               console.log(j);
           }
            document.write("<tr/>");
        }
        document.write("</table>");




        document.write("<table>");
        for(var i=1;i<=9;i++){
            document.write("<tr>");
            for(var j=9;j>=i;j--){
                document.write("<td>"+i+"x"+j+"="+i*j+"</td>");
                console.log(j);
            }
            document.write("<tr/>");
        }
        document.write("</table>");


        document.write("<table>");
        for(var i=9;i>=1;i--){
            document.write("<tr>");
            for(var j=i;j>=1;j--){
                document.write("<td>"+j+"x"+i+"="+j*i+"</td>");
                console.log(j);
            }
            document.write("<tr/>");
        }
        document.write("</table>");



    </script>
</body>
</html>